var vm = new Vue({
    el:"#content",
    data:{
        //定义一个空数组
        re:[],
        list:['全部','待付款','进行中','已完成'],
        myclass:'',
        i:0,
        on:"on",
        willShow:false,
    },
    created:function () {
        this.get();
        //监听滚动
        this.handleScroll()
    },
    methods:{
        //点击切换选项卡传入一个index值判断点击是哪一个
        click:function (index) {
            console.log(index);
            //点击后i的值等于index值
            vm.i = index;
            var tokenVal = $('#token').val();
            console.log(vm.i);
            //当点击全部触发的事件
            if(vm.i==0){
                $(".none").css({"display":"none"});
                //垂直滚动条回复默认
                $("body").css({"overflow-y":"visible"});
                //请求数据
                this.$http({
                    method:"GET",
                    url:mainApp.getUrl('sorder/getList'),
                    params:{token:tokenVal,status:0}
                }).then(function(msg){
                    console.log(msg);
                    if(msg.data.status==1){
                        vm.re = msg.body.result.data;
                        //对数据进行判断小于等于2
                        if(msg.body.result.total<=2){
                            //设置不出现垂直滚动条
                            $("body").css({"overflow-y":"hidden"});
                        }
                    }else{
                        console.log("请求失败");
                        $.show(msg.data.result.message);
                    }
                });
            }
            //当点击待付款触发的事件
            if(vm.i==1){
                $(".none").css({"display":"none"});
                $("body").css({"overflow-y":"visible"});
                //请求后台数据
                this.$http({
                    method:"GET",
                    url:mainApp.getUrl('sorder/getList'),
                    params:{token:tokenVal,status:vm.i}
                }).then(function(msg){
                    //请求数据成功
                    if(msg.data.status==1){
                        //对空数组进行赋值
                        vm.re = msg.body.result.data;
                        //对数据进行判断小于等于2
                        if(msg.body.result.total<=2){
                            //设置不出现垂直滚动条
                            $("body").css({"overflow-y":"hidden"});
                        }
                    }else{
                        //进行弹窗操作
                        $.show(msg.body.result.message);
                    }
                });

            }
            //当点击进行中触发的事件
            if(vm.i==2){
                //请求后台数据
                this.$http({
                    method:"GET",
                    url:mainApp.getUrl('sorder/getList'),
                    params:{token:tokenVal,status:vm.i}
                }).then(function(msg){
                    console.log(msg);
                    if(msg.data.status==1){
                        $(".none").css({"display":"none"});
                        //对数据进行判断，如果数据的总量等于0
                        if(msg.body.result.total==0){
                            //显示空图片
                            $(".none").css({"display":"block","width":"100%","height":"80%","background":"#FFFAFA",});
                            //设置不出现垂直滚动条
                            $("body").css({"overflow-y":"hidden"});
                        }
                        vm.re = msg.body.result.data;
                    }else{
                        console.log("请求失败");
                        $.show(msg.body.result.message);
                    }
                });
            }
            //当点击已完成触发的事件
            if(vm.i==3){
                $(".none").css({"display":"none"});
                //请求后台数据
                this.$http({
                    method:"GET",
                    url:mainApp.getUrl('sorder/getList'),
                    params:{token:tokenVal,status:vm.i}
                }).then(function(msg){
                    console.log(msg);
                    if(msg.data.status==1){
                        vm.re = msg.body.result.data;
                    }else{
                        console.log("请求失败");
                        $.show(msg.result.message);
                    }
                });
            }
        },
        //进入页面获取数据
        get:function (){
            var tokenVal = $('#token').val();
            //请求数据
            this.$http({
                method:"GET",
                url:mainApp.getUrl('sorder/getList'),
                params:{token:tokenVal,status:0}
            }).then(function(msg){
                console.log(msg);
                if(msg.data.status==1){
                    console.log("1111");
                    vm.re = msg.body.result.data;
                }else{
                    console.log("请求失败");
                    $.show(msg.data.result.message);
                }
            });
        },
        //判断是否滚动到底部
        handleScroll:function() {
           var that = this;
            $(window).on('scroll', function() {
                if($(window).scrollTop() >= $(document).height() - $(window).height()) {
                    that.getProList();
                }
            })

        },
        //对数据进行拼接
        getProList:function(){
            var tokenVal = $('#token').val();
            this.$http({
                method:"GET",
                url:mainApp.getUrl('sorder/getList'),
                params:{token:tokenVal,status:0}
            }).then(function(msg){
                console.log(msg);
                if(msg.data.status==1){
                    vm.re = vm.re.concat(msg.body.result.data);
                }else{
                    console.log("请求失败");
                    $.show(msg.body.data.result.message);
                }
            });
        },
    },

})
$(function(){
    var bodyHeight = $("body,html").height();
    $(body).css({"height":"bodyHeight"});
    console.log(bodyHeight)
    $(".navbar").css({"height":bodyHeight+'px'})
    $(".menu").click(function(){
        //页面禁止滚动条
        $(".mask").ontouchstart=function(e){
            e.preventDefault();
        }
        //$("body").css({"overflow-y":"hidden"});
        $(this).toggleClass("active");
        $(".navbar").toggleClass("active");
        showMask();
    })
    //点击遮罩层，收起导航
    $(".mask").click(function(){
        // CloseMask();
        $("#list").css({"overflow-y":"scroll"});
        $(this).toggleClass("active");
        $(".navbar").toggleClass("active");
        hideMask();
    })
    //展示遮罩层
    function showMask(){
        //遮罩层的高度等于屏幕的高度
        $(".mask").css("height",$(window).height());
        //遮罩层的宽度等于屏幕的宽度
        $(".mask").css("width",$(window).width());
        $(".mask").show();
    }
    //隐藏遮罩层
    function hideMask(){
        $(".mask").hide();
    }
})
